﻿@using Sharp.Platform.Configuration
@model Sharp.WebBooter.Areas.CMS.Models.VIUViewModel
@{
    Layout = null;
}

<style>
    .VIU_Edit .select2 {
        height: 400px;
    }

    .VIU_Edit .field legend {
        color: #3c8dbc;
    }

    .VIU_Edit .field fieldset label {
        font-weight: normal;
        cursor: pointer;
    }

    .VIU_Edit .field fieldset input[type=checkbox] {
        cursor: pointer;
    }

    .VIU_Edit .thumbnail {
        /*max-height:100px;*/
    }

    #tagsArea .btn {
        margin-bottom: 4px;
    }
</style>
<section class="content-header">
    <h1>
        <a href="javascript:LoadUI('@Url.Action("Create")')">编辑VIU</a>
    </h1>
    <ol class="breadcrumb">
        <li><a href="@Url.Action("Index", "Home")"><i class="fa fa-home"></i> 首页</a></li>
        <li class="">VIU</li>
        <li class="active">VIU管理</li>
    </ol>
</section>

<section class="content VIU_Edit">
    <div class="row">
        <div class="col-lg-12">
        
                <div class="box box-primary">
                    <div class="box-header with-border text-center">
                        <button class="btn btn-primary" data-bind="click:saveForm">保存VIU</button>
                    </div>
                    <div class="box-body no-padding">

                
                        <nav id="myScrollspy" class="navbar navbar-default navbar-static" role="navigation">


                            <div class="collapse navbar-collapse bs-js-navbar-scrollspy">
                                <ul class="nav navbar-nav">
                                    <li class="active"><a href="#ios">iOS</a></li>
                                    <li><a href="#svn">SVN</a></li>
                                    <li>
                                        <a href="#jmeter">java</a>
                                    </li>
                                </ul>
                            </div>

                        </nav>
                        <div data-spy="scroll" data-target="#myScrollspy" data-offset="0"
                             style="height:200px;overflow:auto; position: relative;">
                            <div class="section">
                                <h4 id="ios">
                                    iOS<small>
                                        <a href="#" onclick="removeSection(this);">
                                            &times; 删除该部分
                                        </a>
                                    </small>
                                </h4>
                                <p>
                                    iOS 是一个由苹果公司开发和发布的手机操作系统。最初是于 2007 年首次发布 iPhone、iPod Touch 和 Apple
                                    TV。iOS 派生自 OS X，它们共享 Darwin 基础。OS X 操作系统是用在苹果电脑上，iOS 是苹果的移动版本。
                                </p>
                            </div>
                            <div class="section">
                                <h4 id="svn">SVN<small></small></h4>
                                <p>Apache Subversion，通常缩写为 SVN，是一款开源的版本控制系统软件。Subversion 由 CollabNet 公司在 2000 年创建。但是现在它已经发展为 Apache Software Foundation 的一个项目，因此拥有丰富的开发人员和用户社区。</p>
                            </div>
                            <div class="section">
                                <h4 id="jmeter">
                                    jMeter<small>
                                        <a href="#" onclick="removeSection(this);">
                                            &times; 删除该部分
                                        </a>
                                    </small>
                                </h4>
                                <p>jMeter 是一款开源的测试软件。它是 100% 纯 Java 应用程序，用于负载和性能测试。</p>
                            </div>
                            <div class="section">
                                <h4 id="ejb">EJB</h4>
                                <p>Enterprise Java Beans（EJB）是一个创建高度可扩展性和强大企业级应用程序的开发架构，部署在兼容应用程序服务器（比如 JBOSS、Web Logic 等）的 J2EE 上。</p>
                            </div>
                            <div class="section">
                                <h4 id="spring">Spring</h4>
                                <p>Spring 框架是一个开源的 Java 平台，为快速开发功能强大的 Java 应用程序提供了完备的基础设施支持。</p>
                                <p>Spring 框架最初是由 Rod Johnson 编写的，在 2003 年 6 月首次发布于 Apache 2.0 许可证下。</p>
                            </div>
                        </div>
                   
                    </div>
                </div>
            
        </div>
    </div>

</section>

<script src="~/Areas/CMS/ViewModel/VIU/Edit.js"></script>

<script>
    $(function () {

        $("#myScrollspy").scrollspy();



        var vm = new VIU_Edit_ViewModel();
        ko.applyBindings(vm, $(".VIU_Edit")[0]);
        vm.init('@Model.Id');

        var uploader = $("#file-4");
        uploader.fileinput({
            uploadUrl: '@Url.Action("ReceivePic")',
            language: 'zh', //设置语言
            showPreview: false,
            showUpload: true, //是否显示上传按钮
            showCaption: true,//是否显示标题
            uploadAsync: true, showDrag: true,
            allowedFileExtensions: ['jpg', 'png', 'gif'], //接收的文件后缀
            uploadExtraData: {
                tempFlag: '@Model.TempFlag'
            }
        })
            .on("filebatchuploadsuccess", function (event, data, previewId, index) {
                //上传成功的一系列操作 ，  比如一些 刷新图片列表
                alert("filebatchuploadsuccess");
            })
        .on("fileuploaded", function (event, data, previewId, index) {

            var pvm = new PictrueViewModel();
            pvm.src = data.response.Data;
            vm.multiMedias.push(pvm);

            //var obj = data.response;
            //alert(JSON.stringify(data));

        });
    });


</script>